<template>
  <div v-loading="dataLoading" class="d_main not">
    <div class="d_header" v-if="!isShowIframe">
      <div class="d_header_title">
        <div class="back pointer" @click="Back">
          <span class="el-icon-arrow-left"></span>
          <p>返回</p>
        </div>
        <h3>{{ $route.query.typeStatus == 4 ? "生产补单" : "生产开单" }}</h3>
      </div>
      <div class="d_header_btn">
        <el-button
          v-if="$route.query.taskProduceState != 4 &&$route.query.produceBillState!=2
          "
          v-loading="orderLoading"
          type="primary"
          size="small"
          :disabled="orderLoading"
          @click="saveOrder"
        >仅保存</el-button
        >
        <el-button
          v-if="($route.query.produceBillState == 0 || Number(this.$route.query.typeStatus) === 0) &&Number(this.$route.query.typeStatus) != 1"
          v-loading="orderLoading"
          type="primary"
          size="small"
          :disabled="orderLoading"
          @click="saveOrder('confirm')"
        >保存并确认</el-button
        >
      </div>
    </div>
    <div class="d_mainCenter">
      <el-form
        ref="orderForm"
        label-position="left"
        :model="productFrom.baseData"
        :rules="rules"
        label-width="100px"
        class="orderForm"
      >
        <div class="d_left p0">
          <div class="d_orderDetails">
            <div class="item">
              <div class="cTitle">
                <h3>订单信息</h3>
              </div>
              <dl>
                <dt>订单单号</dt>
                <dd>
                  {{ productFrom.orderBaseData.saleOrderGroupNumber || "--" }}
                </dd>
              </dl>
              <dl>
                <dt>协议书号</dt>
                <dd>{{ productFrom.orderBaseData.xieYiShuHao || "--" }}</dd>
              </dl>
              <dl>
                <dt>客户单号</dt>
                <dd>{{ productFrom.orderBaseData.customerBillNo || "--" }}</dd>
              </dl>
              <dl>
                <dt>合同号</dt>
                <dd>{{ productFrom.orderBaseData.contractCode || "--" }}</dd>
              </dl>
              <dl>
                <dt>交货日期</dt>
                <dd>{{ productFrom.orderBaseData.deliveryDate || "--" }}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>产品信息</h3>
              </div>
              <dl>
                <dt>产品名称</dt>
                <dd>
                  {{ productFrom.orderBaseData.orderProductName || "--" }}
                </dd>
              </dl>
              <dl>
                <dt>产品编码</dt>
                <dd>
                  {{ productFrom.baseData.productNo || "--" }}
                </dd>
              </dl>
              <dl>
                <dt>产品版面</dt>
                <dd>{{ productFrom.orderBaseData.productLayout || "--" }}</dd>
              </dl>
              <dl>
                <dt>产品版本</dt>
                <dd>{{ productFrom.orderBaseData.productVersions || "--" }}</dd>
              </dl>
              <dl>
                <dt>产品库存</dt>
                <dd>{{ productFrom.stockQuantity }}</dd>
                <el-link :underline="false" type="primary" @click="getDataList">查看</el-link>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>业务信息</h3>
              </div>
              <dl>
                <dt>标签套数</dt>
                <dd>
                  {{ productFrom.orderBaseData.taoZhuangQuantity || "--"
                  }}<span class="unit">{{
                    productFrom.baseData.productUnion
                  }}</span>
                </dd>
              </dl>
              <dl>
                <dt>标签枚数</dt>
                <dd>
                  {{ productFrom.baseData.productTagTotal || "--"
                  }}<span class="unit">枚</span>
                </dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>数据信息</h3>
              </div>
              <dl>
                <dt>数据来源</dt>
                <dd>
                  {{ productFrom.orderBaseData.dataComeFromName || "--" }}
                </dd>
              </dl>
              <dl>
                <dt>数据数量</dt>
                <dd>{{ productFrom.orderBaseData.tagDataQuantity || "--" }}</dd>
              </dl>
              <dl>
                <dt>数据状态</dt>
                <dd>
                  {{ productFrom.orderBaseData.dataProduceState || "--" }}
                </dd>
              </dl>
            </div>
            <!-- <div class="item">
              <div class="cTitle">
                <h3>套装关系</h3>
              </div>
              <labelTree :tree-data="productFrom.packageRelations" />
            </div> -->
            <div class="item">
              <div class="cTitle">
                <h3>产品包装</h3>
              </div>
              <dl>
                <dt>成品样式</dt>
                <dd>{{ productFrom.packageData.productStyleName || "--" }}</dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle !== 1">
                <dt>出标方向</dt>
                <dd>{{ productFrom.packageData.outDirectionName || "--" }}</dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyleName == '卷式'">
                <dt>卷向</dt>
                <dd>
                  {{ productFrom.packageData.scrollDirectionName || "--" }}
                </dd>
              </dl>
              <dl>
                <dt>贴标方式</dt>
                <dd>{{ productFrom.packageData.tagAffixWayName || "--" }}</dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyleName == '卷式'">
                <dt>卷芯大小</dt>
                <dd>
                  {{ productFrom.packageData.mandrelSize || "--"
                  }}<span class="unit">mm</span>
                </dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyleName == '卷式'">
                <dt>外直径不超过</dt>
                <dd>
                  {{ productFrom.packageData.notOverDiameter || "--"
                  }}<span class="unit">mm</span>
                </dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyleName == '卷式'">
                <dt>每卷等于</dt>
                <dd>
                  {{ productFrom.packageData.pageEqualTags || "--"
                  }}<span class="unit">{{
                    productFrom.baseData.productUnion
                  }}</span>
                </dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyleName != '卷式'">
                <dt>每张等于</dt>
                <dd>
                  {{ productFrom.packageData.pageEqualTags || "--"
                  }}<span class="unit">{{
                    productFrom.baseData.productUnion
                  }}</span>
                </dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyleName != '卷式'">
                <dt>每包等于</dt>
                <dd>
                  {{ productFrom.packageData.packageEqualPages || "--"
                  }}<span class="unit">张</span>
                </dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>订单备注</h3>
              </div>
              <div class="d_remark">
                {{ productFrom.orderBaseData.orderRemark }}
              </div>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>其他信息</h3>
              </div>
              <dl>
                <dt>业务员</dt>
                <dd>{{ productFrom.orderBaseData.salesmanName || "--" }}</dd>
              </dl>
              <dl>
                <dt>开单员</dt>
                <dd>{{ productFrom.baseData.createPersonName || "--" }}</dd>
              </dl>
            </div>
          </div>
        </div>
        <div class="d_tag">
          <div class="d_tag_item">
            <div class="cTitle">
              <h3>彩稿信息</h3>
            </div>
            <div class="coloredDrawing">
              <template v-if="urlList && urlList.length > 0">
                <ul class="list list_2">
                  <li v-for="imgsrc in urlList" :key="imgsrc">
                    <el-image :src="imgsrc" :initial-index="4" fit="cover" />
                    <i
                      class="iconfont yulanIco"
                      @click="previewColor(imgsrc.draftFilePreviewUrl)"
                    />
                  </li>
                </ul>
              </template>
              <template v-else>
                <el-empty description="暂无彩稿图" />
              </template>
            </div>
            <div class="cTitle">
              <h3>业务要求</h3>
            </div>
            <div class="lh22">{{productFrom.productInfo.baseData.productRequirement}}</div>
            <div class="cTitle">
              <h3>标签信息</h3>
            </div>
            <div class="tagCon">
              <LableShow :dataArr="productFrom.orderTagDataList"></LableShow>
            </div>
          </div>
        </div>
        <div class="d_content oh-y">
          <div class="cTitle">
            <h3>基础信息</h3>
          </div>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="生产单号">
                <el-input
                  v-model="productFrom.baseData.produceTaskBillNo"
                  size="small"
                  placeholder="系统自动生成"
                  disabled
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="创建日期">
                <el-input
                  v-model="productFrom.baseData.createDate"
                  size="small"
                  disabled
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="创建人员">
                <el-input
                  v-model="productFrom.baseData.createPersonName"
                  size="small"
                  disabled
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="每卷米数" class="PBinfo">
                <el-input
                  v-model="productFrom.baseData.metersPerRoll"
                  disabled
                  size="small"
                  placeholder="系统自动计算"
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生产方式:">
                <el-select
                  v-model="productFrom.baseData.productionMode"
                  size="small"
                  disabled
                  style="width:100%"
                  filterable
                  placeholder="请选择"
                >
                  <el-option label="版辊尺寸" :value="1"> </el-option>
                  <el-option label="数码版面" :value="2"> </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生产尺寸:">
                <el-input
                  v-model="productFrom.baseData.productionDimensions"
                  placeholder="请输入内容"
                  type="number"
                  disabled
                  size="small"
                >
                  <div
                    slot="suffix"
                    style="padding-right: 5px; padding-top: 3px"
                  >
                    <span v-if="productFrom.baseData.productionMode == 1">T</span>
                    <span v-else>mm</span>
                  </div>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="跳距">
                <el-input
                  v-model="productFrom.baseData.makeup_SkipDistance"
                  placeholder="请输入长度"
                  size="small"
                  disabled
                >
                  <template slot="append">mm</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="间距">
                <el-input
                  v-model="productFrom.baseData.makeup_SpaceBetween"
                  placeholder="请输入长度"
                  size="small"
                  disabled
                >
                  <template slot="append">mm</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="留边尺寸">
                <el-input
                  v-model="productFrom.baseData.marginSize"
                  placeholder="请输入长度"
                  size="small"
                  disabled
                >
                  <template slot="append">mm</template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="印刷拼版">
                <el-input
                  v-model="productFrom.baseData.makeup_Combine"
                  placeholder="请输入内容"
                  size="small"
                  disabled
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="刀版模数">
                <el-input
                  v-model="productFrom.baseData.makeup_Modules"
                  placeholder="请输入内容"
                  size="small"
                  disabled
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="平张断张">
                <el-input
                  v-model="productFrom.baseData.makeup_PzDz"
                  placeholder="请输入内容"
                  size="small"
                  disabled
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="色数">
                <el-input
                  v-model="productFrom.baseData.makeup_Colors"
                  placeholder="请输入内容"
                  size="small"
                  disabled
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="每组数量">
                <el-input
                  v-model="productFrom.baseData.eachGroupQuantity"
                  placeholder="请输入每组数量"
                  size="small"
                  disabled
                >
                  <template slot="append">{{
                      productFrom.baseData.productUnion
                    }}</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="每组高度">
                <el-input
                  v-model="productFrom.baseData.eachGroupHeight"
                  placeholder="请输入每组高度"
                  size="small"
                  disabled
                >
                  <template slot="append">mm</template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="理论用料">
                <el-input
                  v-model="productFrom.baseData.theoreticalMaterials"
                  placeholder="系统自动计算"
                  :disabled="disabled"
                  size="small"
                >
                  <template slot="append">米</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="打印用料" prop="printingMaterials">
                <el-input
                  v-model="productFrom.baseData.printingMaterials"
                  size="small"
                  :disabled="disabled"
                >
                  <template slot="append">米</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="计划用料" prop="plannedMaterials">
                <el-input
                  v-model="productFrom.baseData.plannedMaterials"
                  size="small"
                  :disabled="disabled"
                  @blur="handlePlanned"
                >
                  <template slot="append">米</template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="8">
              <el-form-item label="到料情况">
                <el-input
                  v-model="productFrom.baseData.materialArrival"
                  size="small"
                  :disabled="disabled"
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生产数量" prop="productionQuantity">
                <el-input
                  v-model="productFrom.baseData.productionQuantity"
                  placeholder="请输入生产数量"
                  size="small"
                  :disabled="disabled"
                  @input="handleProductionQuantity"
                >
                  <template slot="append">{{
                      productFrom.baseData.productUnion
                    }}</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生产类型" prop="productionQuantity">
                <el-input
                  v-model="productFrom.baseData.produceBillTypeName"
                  placeholder="请输入生产类型"
                  size="small"
                  disabled
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="刀版信息">
                <el-input
                  v-model="productFrom.baseData.knifeInformation"
                  size="small"
                  :disabled="isDisable"
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="印版信息">
                <el-input
                  v-model="productFrom.baseData.plateInformation"
                  size="small"
                  :disabled="isDisable"
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <div v-if="productFrom.packageData.productStyleName == '卷式'">
            <div class="cTitle">
              <h3>包装信息(卷式)</h3>
            </div>
            <el-row :gutter="24">
              <el-col :span="8">
                <el-form-item label="每卷等于">
                  <el-input
                    v-model="productFrom.packageData.pageEqualTags"
                    placeholder="请输入内容"
                    size="small"
                    @blur="calculation"
                    disabled
                  >
                    <template slot="append">{{
                        productFrom.baseData.productUnion
                      }}</template>
                  </el-input>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
                <el-form-item label="每箱等于">
                  <el-input
                    v-model="productFrom.packageData.boxEqualPackages"
                    placeholder="请输入内容"
                    size="small"
                    @blur="calculation"
                    :disabled="isDisable"
                  >
                    <template slot="append">卷</template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="每箱共计">
                  <el-input
                    v-model="productFrom.packageData.boxEqualTags"
                    placeholder="请输入内容"
                    size="small"
                    disabled
                  >
                    <template slot="append">{{
                      productFrom.baseData.productUnion
                    }}</template>
                  </el-input>
                </el-form-item>
              </el-col> -->
            </el-row>
          </div>
          <div v-else>
            <div class="cTitle">
              <h3>包装信息(平张/折页)</h3>
            </div>
            <el-row :gutter="24">
              <el-col :span="8">
                <el-form-item label="计算方式">
                  <el-select
                    v-model="productFrom.packageData.calculationMethod"
                    size="small"
                    style="width: 100%"
                    disabled
                    filterable
                    placeholder="请选择"
                    @change="handleSelectChange"
                  >
                    <el-option
                      :label="productFrom.baseData.productUnion+'/张'"
                      :value="0"
                    >
                    </el-option>
                    <el-option label="套/张" :value="1"> </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item :label="'每' + packingUnitLable + '等于'">
                  <el-input
                    v-model="productFrom.packageData.pageEqualTags"
                    placeholder="请输入内容"
                    size="small"
                    @blur="calculation"
                    disabled
                  >
                    <template slot="append">{{
                        productFrom.baseData.productUnion == "枚"
                          ? "枚"
                          : packingUnit
                      }}</template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="每包等于">
                  <el-input
                    v-model="productFrom.packageData.packageEqualPages"
                    placeholder="请输入内容"
                    size="small"
                    @blur="calculation"
                    disabled
                  >
                    <template slot="append">张</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <!-- <el-row :gutter="24">
              <el-col :span="8">
                <el-form-item label="每箱等于">
                  <el-input
                    v-model="productFrom.packageData.boxEqualPackages"
                    placeholder="请输入内容"
                    size="small"
                    @blur="calculation"
                    :disabled="isDisable"
                  >
                    <template slot="append">包</template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="每箱共计">
                  <el-input
                    v-model="productFrom.packageData.boxEqualTags"
                    placeholder="请输入内容"
                    size="small"
                    :disabled="isDisable"
                  >
                    <template slot="append">{{
                      productFrom.baseData.productUnion
                    }}</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row> -->
          </div>

          <div class="cTitle">
            <h3>生产工艺</h3>
            <el-button
            v-if="$route.query.taskProduceState != 4 &&$route.query.produceBillState!=2
            "
              type="text"
              @click="showCraft = true"
              style="color: #3f61f1"
            >
              <i class="iconfont xinjian" />
              <p>选择工艺</p>
            </el-button>
          </div>
          <!-- 表格区域       -->
          <div class="tableCon">
            <div class="tableDiv">
              <div class="table-header-group">
                <ul class="flex">
                  <li style="width: 70px">工艺编号</li>
                  <li style="width: 190px">工艺名称</li>
                  <li style="width: 100px">工艺设备</li>
                  <li style="width: 100px">计划工时</li>
                  <li style="width: 80px">标准效率</li>
                  <li style="flex:1">备注</li>
                  <li style="width: 50px"
                    v-if="$route.query.taskProduceState != 4 &&$route.query.produceBillState!=2
                    "
                  >
                    操作
                  </li>
                </ul>
              </div>
              <div class="table-row-group" id="dragList">
                <vuedraggable v-model="productFrom.produceCraftList" :move="handleMove">
                  <template v-for="(cl, index) in productFrom.produceCraftList">
                    <ul :key="index" class="flex">
                      <!-- <li class="textCenter my-handle pointer">
                        <i class="iconfont extend" />
                      </li> -->
                      <li style="width: 70px">{{ cl.produceCraft.produceCraftNo }}</li>
                      <li style="width: 190px">{{ cl.produceCraft.produceCraftName }}</li>
                      <li style="width: 100px">
                        <el-select
                          filterable
                          v-model="cl.produceCraft.produceEquipment"
                          placeholder="请选择设备"
                          clearable
                          size="mini"
                          :disabled="$route.query.taskProduceState== 4 ||cl.produceCraft.craftTaskState>0||$route.query.produceBillState==2"
                          @change="changDviesAndCraf"
                        >
                          <el-option
                            v-for="op in cl.craftEquipments"
                            :key="op.equipmentCode"
                            :label="op.equipmentName"
                            :value="op.equipmentCode"
                          />
                        </el-select>
                      </li>
                      <li style="width: 100px">
                        <el-input
                          v-model="cl.produceCraft.craftTaskPlanUseTime"
                          v-toFixed="3"
                          placeholder="请输入内容"
                          :ref="'UseTime'+index"
                          size="mini"
                          @keydown.enter.native="handleKeydown(index)"
                          @blur="handlePlanned"
                          :disabled="$route.query.taskProduceState== 4 ||cl.produceCraft.craftTaskState>0||$route.query.produceBillState==2
                          "
                        >
                          <!--                        <template slot="append">分钟</template>-->
                        </el-input>
                      </li>
                      <li style="width: 80px">
                        {{ cl.produceCraft.standardEfficiency }}
                      </li>
                      <li  style="flex:1">
                        <el-input
                          v-model="cl.produceCraft.craftTaskRemark"
                          placeholder="请输入内容"
                          size="mini"
                          :disabled="$route.query.taskProduceState== 4 ||cl.produceCraft.craftTaskState>0||$route.query.produceBillState==2"
                        />
                      </li>
                      <li
                      style="width: 50px"
                        v-if="$route.query.taskProduceState != 4 && cl.produceCraft.craftTaskState<0&& $route.query.produceBillState!=2
                        "
                        class="textCenter"
                      >
                        <span
                          class="pointer mr5 "
                          v-if="$route.query.taskProduceState != 4&& cl.produceCraft.craftTaskState<0 && $route.query.produceBillState!=2"
                          @click="craftDelete(cl, index)"
                          ><i class="el-icon-delete"
                        /></span>
                      </li>
                    </ul>
                  </template>
                </vuedraggable>
              </div>
            </div>
          </div>

          <div class="cTitle">
            <h3>颜色信息</h3>
          </div>
          <el-table
            :data="productFrom.productPrintingColorList"
            fit
            style="width: 100%"
          >
            <el-table-column prop="colorType" label="颜色类型" width="90">
              <template scope="{row}">
                {{ row.colorType == 1 ? "普通" : "专色" }}
              </template>
            </el-table-column>
            <el-table-column label="颜色名称" prop="colorName" width="160" />
            <el-table-column prop="colorReference" label="参考" width="100">
              <template scope="{row}">
                {{
                  querySelectName(
                    colorReferenceList,
                    row.colorReference,
                    "label",
                    "value"
                  )
                }}
              </template>
            </el-table-column>
            <el-table-column prop="machineCode" label="设备" width="200">
              <template scope="{row}">
                <el-select
                  v-model="row.machineCode"
                  :disabled="isDisable"
                  placeholder="请选择"
                  size="small"
                  filterable
                >
                  <el-option
                    v-for="item in allMaterielClass"
                    :key="item.machineCode"
                    :label="item.machineName"
                    :value="item.machineCode"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="colorRemark" label="备注" width="auto">
              <template scope="{row}">
                {{ row.colorRemark || "--" }}
              </template>
            </el-table-column>
          </el-table>
          <div class="cTitle">
            <h3>生产物料</h3>
            <el-button
            v-if="$route.query.taskProduceState != 4 &&$route.query.produceBillState!=2
              "
              type="text"
              @click="selectshowMateria"
              style="color: #3f61f1"
            >
              <i class="iconfont xinjian" />
              <p>选择物料</p>
            </el-button>
          </div>
          <!-- 表格区域       -->
          <div class="tableCon">
            <div class="tableDiv">
              <div class="table-header-group">
                <ul class="flex">
                  <li style="width:100px">规格编号</li>
                  <li style="width:100px">物料名称</li>
                  <li style="width:70px">规格型号</li>
                  <li style="width:70px">物料类型</li>
                  <li style="width:70px">库存数量</li>
                  <!-- <li>计划用料</li>
                  <li>打印用料</li> -->
                  <li style="width:200px">使用工艺</li>
                  <li style="flex: 1">备注</li>
                  <li
                  style="width: 50"
                    v-if="$route.query.taskProduceState != 4 &&$route.query.produceBillState!=2"
                  >
                    操作
                  </li>
                </ul>
              </div>
              <div class="table-row-group">
                <template
                  v-for="(cl, index) in productFrom.produceMaterialList"
                >
                  <ul :key="index" class="flex">
                    <li style="width:100px" class="overflow">{{ cl.goodsCode }}</li>
                    <el-tooltip effect="dark" :content="cl.goodsName" placement="top-end">
                      <li style="width:100px" class="overflow">{{ cl.goodsName }}</li>
                    </el-tooltip>
                    <li style="width:70px" class="overflow">{{ cl.stockGoodsName }}</li>
                    <li style="width:70px" class="overflow">{{ cl.categoryName }}</li>
                    <li style="width:70px" class="overflow">{{ cl.stockQuantity }}</li>
                    <li style="width:200px">
                      <el-select
                        v-model="cl.craftTaskClientNo"
                        placeholder="请选择工艺"
                        clearable
                        filterable
                        size="mini"
                        :disabled="$route.query.taskProduceState== 4||$route.query.produceBillState==2"
                        @change="changDviesAndCraf"
                        @focus="fillSelect"
                      >
                        <el-option
                          v-for="(op, index) in selectArr"
                          :key="index"
                          :label="op.name"
                          :value="op.craftTaskClientNo"
                        />
                      </el-select>
                    </li>
                    <li style="flex:1">
                      <el-input
                        v-model="cl.produceMaterialRemark"
                        placeholder="请输入"
                        size="mini"
                        :disabled="$route.query.taskProduceState== 4||$route.query.produceBillState==2"
                      />
                    </li>
                    <li
                    style="width:50px"
                      v-if="$route.query.taskProduceState != 4 &&$route.query.produceBillState!=2"
                      class="textCenter"
                    >
                      <span class="pointer mr5" @click="matairDelete(index)"
                      ><i class="el-icon-delete"
                      /></span>
                    </li>
                  </ul>
                </template>
              </div>
            </div>
          </div>
          <div class="cTitle">
            <h3>生产备注</h3>
          </div>
          <div class="d_remark">
            <el-input
              v-model="productFrom.baseData.produceRemark"
              type="textarea"
              :autosize="{ minRows: 5 }"
              placeholder="请输入内容"
              size="mini"
              :disabled="isDisable"
            />
          </div>
        </div>
      </el-form>
    </div>

    <!--   生产工艺on -->
    <SelectCraftlist
      ref="selectCrafList"
      :per-visible.sync="showCraft"
      @refuseLists="refuseListsAll"
    />
    <!--   选择物料  -->
    <SelectMateriaList
      ref="materiaList"
      :per-visible.sync="showMateria"
      @getMateriListData="refuseListsMateriAll"
    />
    <el-image-viewer
      v-show="isShadeShow"
      style="z-index: 5000"
      :initial-index="0"
      :on-close="onCloseviewer"
      :url-list="urlList"
    />


    <el-dialog
      v-dialogDrag
      title="成品库存"
      :visible.sync="isVisible"
      :close-on-click-modal="false"
      height="16vh"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
    >
      <div class="dialogDody p16">
        <!-- 表格区域       -->
        <div class=" lastTdNoBorder" style="height:100%">
          <el-table
            v-loading="searchLoading"
            :data="dataList"
            border
            height="100%"
          >
            <el-table-column
              prop="productSpecificationNumber"
              label="成品编号"
              min-width="170"
            />
            <el-table-column
              prop="productName"
              label="成品名称"
              show-overflow-tooltip
              width="180"
            />
            <el-table-column prop="customerName" label="客户名称" show-overflow-tooltip
                             width="180" />
            <el-table-column
              prop="productSpecificationName"
              label="型号规格"
              width="130"
              show-overflow-tooltip
            />
            <el-table-column
              prop="productLayout"
              label="印刷版面"
              width="130"
              show-overflow-tooltip
            />
            <el-table-column
              prop="productVersion"
              label="产品版本"
              width="130"
              show-overflow-tooltip
            />
            <el-table-column
              prop="productUnit"
              label="成品单位"
              width="130"
              show-overflow-tooltip
            />
            <el-table-column
              prop="stockQuantity"
              label="库存总数"
              width="130"
              show-overflow-tooltip
            />
            <el-table-column
              prop="updatorName"
              label="更新人员"
              width="130"
              show-overflow-tooltip
            />
            <el-table-column
              prop="updateTime"
              label="更新时间"
              width="130"
              show-overflow-tooltip
            />
          </el-table>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isVisible = false">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import SelectCraftlist from "@/components/selectCraft";
import SelectMateriaList from "@/components/selectMaterial";
import labelTree from "@/components/labelTree";
import { querySelectName } from "@/utils";
import LableShow from "@/components/lableShow";
import { mapGetters } from "vuex";
import { uuid } from "vue-uuid";
import Sortable from "sortablejs";
import ElImageViewer from "element-ui/packages/image/src/image-viewer";
import vuedraggable from 'vuedraggable';
export default {
  name: "productionOrderNewDetail",
  components: {
    labelTree,
    SelectCraftlist,
    SelectMateriaList,
    ElImageViewer,
    LableShow,
    vuedraggable
  },
  computed: {
    ...mapGetters(["userInfo", "name"]),
    // getstandardEfficiency() {
    //   return function (index) {
    //     if (this.productFrom.baseData.plannedMaterials === 0 || index === 0) {
    //       return 0;
    //     } else {
    //       return (
    //         (this.productFrom.baseData.plannedMaterials / index) *
    //         60
    //       ).toFixed(0);
    //     }
    //   };
    // },
  },
  data() {
    return {
      querySelectName,
      isVisible:false,
      dataList:[],
      searchLoading:false,
      orderInfos: {
        productData: {
          tagDataList: [{}, {}, {}],
        },
      },
      colorReferenceList: [
        {
          label: "彩稿",
          value: 1,
        },
        {
          label: "样标",
          value: 2,
        },
        {
          label: "封样",
          value: 3,
        },
      ],
      search: {
        pageIndex: 1,
        pageSize: 999,
        queryDataBaseFiled: "productSpecificationNumber",
        likeWords: "",
        isShowDisabled: 0,
        productNo: "",
      }, // 成品库存搜索条件
      isShowIframe:false,
      selectArr: [],
      isShadeShow: false,
      allMaterielClass: [], //设备数据
      urlList: [], // 图片列表
      showViewer: false, // 预览图片
      showOrder: false, // 订单弹窗
      showCraft: false, // 选择工艺
      showMateria: false, // 选择物料
      orderNo: "", // 订单号
      productionNum: false,
      loading: null,
      conIndex: 0,
      tabsIndex: 0, // 右侧tabs切换索引
      tagIndex: 0, // 当前标签索引
      colorOps: "add", // 印刷颜色当前操作
      colorEditIndex: null, // 印刷颜色修改的索引
      dataLoading: false, // 订单详情数据加载
      orderLoading: false, // 订单保存加载效果
      isAddColor: false, // 印刷颜色新增弹框是否打开
      produceTasksID: "",
      // 设置时间控件小于当前日期不能选择
      option: {
        disabledDate: (time) => {
          return time.getTime() < Date.now() - 1 * 24 * 3600 * 1000;
        },
      },
      productFrom: {
        baseData: {},
        packageData: {},
        orderBaseData: {},
      },
      packingUnitLable: "",
      packingUnit: "",
      isDisable: false, // 是否禁用输入框
      disabled: false,
      typeStatus: 0,
      rules: {
        productionQuantity: [
          { required: true, message: "请输入生产数量", trigger: "blur" },
        ],
        makeup_SkipDistance: [
          { required: true, message: "请输入跳距", trigger: "blur" },
        ],
        makeup_SpaceBetween: [
          { required: true, message: "请输入间距", trigger: "blur" },
        ],
        marginSize: [
          { required: true, message: "请输入留边尺寸", trigger: "blur" },
        ],
        makeup_Combine: [
          { required: true, message: "请输入拼版信息", trigger: "blur" },
        ],
        makeup_Colors: [
          { required: true, message: "请输入色数", trigger: "blur" },
        ],
        printingMaterials: [
          { required: true, message: "请输入打印用料", trigger: "blur" },
        ],
        plannedMaterials: [
          { required: true, message: "请输入计划用料", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.getTypeStatus();
    this.loading = this.$loading({
      lock: true,
      text: "数据加载中",
      spinner: "el-icon-loading",
      fullscreen: true,
      background: "rgba(0, 0, 0, 0.7)",
    });
  },
  deactivated() {
    // localStorage.removeItem('orderInit')
  },
  beforeDestroy() {
    // localStorage.removeItem('orderInit')
  },
  mounted() {
    // this.setSort();
    this.getMaterielClass();
  },
  methods: {
    getTypeStatus() {
      this.typeStatus = Number(this.$route.query.typeStatus);
      if(this.$route.query.isIframe){
        this.isShowIframe = true
      }

      if((this.$route.query.taskProduceState == 0 ||Number(this.$route.query.typeStatus) === 0) && Number(this.$route.query.typeStatus) != 1){
        this.isDisable = false;
        this.disabled = false;
      }else{
        this.isDisable = true;
        this.disabled = true;
      }
      if (Number(this.$route.query.typeStatus) === 0) {
        this.getOrderDetail();
      } else if (Number(this.$route.query.typeStatus) === 1) {
        // this.isDisable = true;
        // this.disabled = true;
        this.productionNum = true;
        this.getTaskBillDetail();
      } else if (Number(this.$route.query.typeStatus) === 2) {
        this.getTaskBillDetail();
        if (this.$route.query.type == "生产补单") {
          // this.isDisable = true;
          // this.disabled = true;
          this.productionNum = false;
        }
      } else if (Number(this.$route.query.typeStatus) === 3) {
        // this.isDisable = true;
        // this.disabled = true;
        this.productionNum = true;
        this.getTaskBillDetail();
      } else if (Number(this.$route.query.typeStatus) === 4) {
        this.getCreateProduceTaskBill();
        // this.isDisable = true;
        // this.disabled = true;
        this.productionNum = false;
      } else if (Number(this.$route.query.typeStatus) === 5) {
        this.getCopyOrderDetail();
      }
    },

    handleProductionQuantity(){
      if(!this.productFrom.baseData.productionQuantity){
        this.productFrom.baseData.productionQuantity = this.productFrom.orderBaseData.tagDataQuantity
      }
    },

    handleSeeStockQuantity(){
      this.visible = true
    },

    // 成品列表
    getDataList() {
      const params = this.search;
      this.searchLoading = true;
      this.$api.warehouse
        .GetFinishedProductStockPageList(params)
        .then((res) => {
          res.list.forEach((item) => {
            if (!item.updateUser) {
              item.updateUser = item.createUser;
            }
            if (!item.updateTime) {
              item.updateTime = item.createTime;
            }
          });
          this.dataList = res.list;
          this.isVisible = true
          this.searchLoading = false;
        })
        .catch(() => {
          this.searchLoading = false;
        });
    },

    // 获取所有设备
    getMaterielClass() {
      this.$api.product
        .GetMatchProductDevices({
          likeWords: "",
          machineState: 1,
        })
        .then((res) => {
          this.allMaterielClass = res;
        });
    },

    //拖拽
    handleMove(e){
      if(e.draggedContext.element.produceCraft.craftTaskState>0){
        return false
      }

      if(e.relatedContext.element.produceCraft.craftTaskState>0){
        return false
      }
    },

    //计算标准效率
    handlePlanned() {
      if (this.productFrom.produceCraftList.length > 0) {
        this.productFrom.produceCraftList.forEach((e) => {
          e.produceCraft.standardEfficiency = Math.ceil(
            (this.productFrom.baseData.plannedMaterials /
              e.produceCraft.craftTaskPlanUseTime) *
            60
          );
          if (!Number.isFinite(e.produceCraft.standardEfficiency)) {
            e.produceCraft.standardEfficiency = 0;
          }
        });
      }
    },

    //计算
    calculation() {
      if (this.productFrom.packageData.productStyleName == "卷式") {
        this.productFrom.packageData.boxEqualTags =
          this.productFrom.packageData.pageEqualTags *
          this.productFrom.packageData.boxEqualPackages;
        console.log(this.productFrom.packageData.boxEqualTags);
      } else {
        if (this.productFrom.packageData.calculationMethod == 0) {
          this.productFrom.packageData.boxEqualTags =
            this.productFrom.packageData.pageEqualTags *
            this.productFrom.packageData.packageEqualPages *
            this.productFrom.packageData.boxEqualPackages;
          this.packingUnitLable = "张";
          this.packingUnit = "套";
        } else if (this.productFrom.packageData.calculationMethod == 1) {
          this.productFrom.packageData.boxEqualTags =
            (this.productFrom.packageData.packageEqualPages /
              this.productFrom.packageData.pageEqualTags) *
            this.productFrom.packageData.boxEqualPackages;
          this.packingUnitLable = "套";
          this.packingUnit = "张";
        }
      }
    },

    //包装信息计算方式选择事件
    handleSelectChange(val) {
      if (val == 0) {
        this.productFrom.packageData.pageEqualTags =
          1 / this.productFrom.packageData.pageEqualTags;
        this.productFrom.packageData.boxEqualTags =
          this.productFrom.packageData.pageEqualTags *
          this.productFrom.packageData.packageEqualPages *
          this.productFrom.packageData.boxEqualPackages;
        this.packingUnitLable = "张";
        this.packingUnit = "套";
      } else if (val == 1) {
        this.productFrom.packageData.pageEqualTags =
          1 / this.productFrom.packageData.pageEqualTags;
        this.productFrom.packageData.boxEqualTags =
          (this.productFrom.packageData.packageEqualPages /
            this.productFrom.packageData.pageEqualTags) *
          this.productFrom.packageData.boxEqualPackages;
        this.packingUnitLable = "套";
        this.packingUnit = "张";
      }
      this.$forceUpdate();
    },

    selectshowMateria() {
      if (
        this.productFrom.produceCraftList.length <= 0 &&
        this.isDisable !== true
      ) {
        this.$message({
          type: "error",
          message: "请先选择生产工艺!",
        });
        return;
      } else {
        this.showMateria = true;
        // this.productFrom.produceMaterialList.forEach(e => {
        //   e.craftTaskClientNo = ''
        // })
      }
    },
    selectChange(index) {
      this.conIndex = index;
    },
    //
    changDviesAndCraf() {
      // this.fillSelect()
    },
    // 预览彩稿
    previewColor(url) {
      this.isShadeShow = true;
      this.colorImagUrl = url;
    },
    getName(arr, code) {
      let name = "";
      arr.forEach((e) => {
        if (e.equipmentCode === code) {
          name = e.equipmentName;
        }
      });
      return name;
    },

    //计划工时回车事件
    handleKeydown(index){
      if(index == this.productFrom.produceCraftList.length-1){
        return
      }else{
        index++
        this.$refs["UseTime"+index][0].focus()
        this.$refs["UseTime"+index][0].select()
      }
    },

    fillSelect() {
      const _selectArr = [];
      for (
        let index = 0;
        index < this.productFrom.produceCraftList.length;
        index++
      ) {
        const _a = {};
        _a.craftTaskClientNo =
          this.productFrom.produceCraftList[
            index
            ].produceCraft.craftTaskClientNo;
        _a.name =
          this.productFrom.produceCraftList[index].produceCraft
            .produceCraftName +
          "/" +
          this.getName(
            this.productFrom.produceCraftList[index].craftEquipments,
            this.productFrom.produceCraftList[index].produceCraft
              .produceEquipment
          );
        // this.productFrom.produceCraftList[
        //   index
        // ].produceCraft.craftTaskClientNo = _a.craftTaskClientNo
        _selectArr.push(_a);
      }
      this.selectArr = _selectArr;
    },
    // 获取订单详情
    getOrderDetail() {
      const parmas = {
        saleOrderNo: this.$route.query.saleOrderCode,
        // oldSaleOrderNo: this.$route.query.oldSaleOrderNo,
        produceBillType: this.$route.query.productType,
      };
      this.$api.product
        .AutoCreateProduceTaskBill(parmas)
        .then((res) => {
          const obj = {
            produceTaskBillNo: res.produceTaskBillNo,
            produceTaskID: this.$route.query.produceTaskID,
          };
          this.$api.product
            .GetProduceTaskBillDetail(obj)
            .then((res) => {
              this.productFrom = res;
              this.productFrom.baseData.productionQuantity = this.productFrom.orderBaseData.taoZhuangQuantity - this.productFrom.stockQuantity
              if(this.productFrom.baseData.productionQuantity<0){
                this.productFrom.baseData.productionQuantity = 0
              }
              // if(!this.productFrom.baseData.productionQuantity){
              //   this.productFrom.baseData.productionQuantity = res.orderBaseData.tagDataQuantity
              // }
              this.getProductDetail();
              if (!this.productFrom.baseData.productUnion) {
                this.productFrom.baseData.productUnion = "枚";
              }

              res.produceCraftList.forEach((n) => {
                n.produceCraft.craftTaskClientNo = n.produceCraft
                  .craftTaskClientNo
                  ? n.produceCraft.craftTaskClientNo
                  : uuid.v4();
              });
              res.produceMaterialList.forEach((e) => {
                res.produceCraftList.forEach((n) => {
                  if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
                    n.produceCraft.craftTaskClientNo = e.craftTaskClientNo;
                    this.selectArr.push({
                      name:
                        n.produceCraft.produceCraftName +
                        "/" +
                        this.getName(
                          n.craftEquipments,
                          n.produceCraft.produceEquipment
                        ),
                      craftTaskClientNo: e.craftTaskClientNo,
                    });
                  }
                });
              });
              this.calculation();

              this.loading.close();
            })
            .catch(() => {
              this.loading.close();
            });
          setTimeout(() => {
            this.showColorDrafts();
          }, 300);
          this.$message.success("生产单创建成功!");
          this.calculation();
          this.loading.close();
        })
        .catch(() => {
          this.loading.close();
        });
    },
    // 根据老生产单复制创建新的生产任务单
    getCreateProduceTaskBill() {
      const parmas = {
        produceTaskBillNo: this.$route.query.produceTaskBillNo,
      };
      this.$api.product
        .CopyCreateProduceTaskBill(parmas)
        .then((res) => {
          this.produceTasksID = res.baseData.produceTaskID

          this.getTaskBillDetail();
          // this.productFrom = res;

          // this.showColorDrafts();
          // res.produceCraftList.forEach((n) => {
          //   n.produceCraft.craftTaskClientNo = n.produceCraft.craftTaskClientNo
          //     ? n.produceCraft.craftTaskClientNo
          //     : uuid.v4();
          // });
          // res.produceMaterialList.forEach((e) => {
          //   res.produceCraftList.forEach((n) => {
          //     if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
          //       n.produceCraft.craftTaskClientNo = e.craftTaskClientNo;
          //       this.selectArr.push({
          //         name:
          //           n.produceCraft.produceCraftName +
          //           "/" +
          //           this.getName(
          //             n.craftEquipments,
          //             n.produceCraft.produceEquipment
          //           ),
          //         craftTaskClientNo: e.craftTaskClientNo,
          //       });
          //     }
          //   });
          // });
          // this.calculation();
          // this.loading.close();
        })
        .catch(() => {
          this.loading.close();
        });
    },
    // 生产任务单明细数据
    getTaskBillDetail() {
      const parmas = {
        produceTaskBillNo: this.$route.query.produceTaskBillNo,
        produceTaskID: this.$route.query.produceTaskID,
      };
      this.$api.product
        .GetProduceTaskBillDetail(parmas)
        .then((res) => {
          this.productFrom = res;

          this.productFrom.produceMaterialList.forEach((item)=>{
            item.goodsCode = item.specificationCode;
            item.goodsName = item.goodsName;
            item.stockGoodsName = item.specificationName;
            item.categoryName = item.categoryName;
            item.stockQuantity = item.stockQuantity;
            item.produceMaterialRemark = item.produceMaterialRemark;
          })
          if (this.productFrom.baseData.productionMode == 0) {
            this.productFrom.baseData.productionMode = "";
          }

          if (!this.productFrom.baseData.productUnion) {
            this.productFrom.baseData.productUnion = "枚";
          }
          this.getProductDetail();
          this.fillSelect()
          // this.showColorDrafts();
          // res.produceCraftList.forEach((n) => {
          //   n.produceCraft.craftTaskClientNo = n.produceCraft.craftTaskClientNo
          //     ? n.produceCraft.craftTaskClientNo
          //     : uuid.v4();
          // });
          // res.produceMaterialList.forEach((e) => {
          //   res.produceCraftList.forEach((n) => {
          //     if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
          //       n.produceCraft.craftTaskClientNo = e.craftTaskClientNo;
          //       this.selectArr.push({
          //         name:
          //           n.produceCraft.produceCraftName +
          //           "/" +
          //           this.getName(
          //             n.craftEquipments,
          //             n.produceCraft.produceEquipment
          //           ),
          //         craftTaskClientNo: e.craftTaskClientNo,
          //       });
          //     }
          //   });
          // });
          this.calculation();

          this.loading.close();
        })
        .catch(() => {
          this.loading.close();
        });
    },

    //获取产品详情
    getProductDetail(val) {
      let code;
      if (this.$route.query.productCode) {
        code = this.$route.query.productCode;
      } else {
        code = this.productFrom.orderBaseData.productCode;
      }
      const parmas = {
        queryBy: 2,
        queryValue: code,
      };
      this.$api.business.GetSingleProductByProductCode(parmas).then((res) => {
        let productStyleList = [
          { label: "卷式", value: 2 },
          { label: "平张", value: 1 },
          { label: "折页", value: 3 },
        ]; //产品样式下拉数据

        let outDirectionList = [
          { label: "上", value: 1 },
          { label: "下", value: 2 },
          { label: "左", value: 3 },
          { label: "右", value: 4 },
        ]; //出标方向
        this.productFrom.orderBaseData.orderProductName =
          res.baseData.productName;
        this.productFrom.baseData.productNo = res.baseData.productNumber;
        this.search.likeWords = res.baseData.productNumber
        this.productFrom.orderBaseData.printingSurface =
          res.baseData.productLayout;
        this.productFrom.orderBaseData.productVersions =
          "V" + res.baseData.newVersion + "." + res.baseData.updateVersion;

        //产品包装
        this.productFrom.packageData.productStyleName = querySelectName(
          productStyleList,
          res.baseData.productStyle,
          "label",
          "value"
        );
        this.productFrom.packageData.outDirectionName = querySelectName(
          outDirectionList,
          res.baseData.outDirection,
          "label",
          "value"
        );
        this.productFrom.packageData.scrollDirectionName =
          res.baseData.scrollDirection == 1 ? "页面朝内" : "页面朝外";
        this.productFrom.packageData.tagAffixWayName = this.format(
          res.baseData.tagAffixWay
        );
        this.productFrom.packageData.mandrelSize = res.baseData.mandrelSize;
        this.productFrom.packageData.notOverDiameter =
          res.baseData.notOverDiameter;
        this.productFrom.packageData.pageEqualTags = res.baseData.pageEqualTags;
        this.productFrom.packageData.packageEqualPages =
          res.baseData.packageEqualPages;
        // this.productFrom.packageData.calculationMethod = res.baseData.calculationMethod
        this.productFrom.baseData.productUnion = res.baseData.productUnit;
        this.productFrom.baseData.productTagTotal =
          this.productFrom.orderBaseData.taoZhuangQuantity *
          res.baseData.productTagNumber;

        //基础信息
        this.productFrom.baseData.makeup_SkipDistance =
          res.baseData.makeupSkipDistance;
        this.productFrom.baseData.makeup_SpaceBetween =
          res.baseData.makeupSpaceBetween;
        this.productFrom.baseData.marginSize = res.baseData.marginSize;
        this.productFrom.baseData.makeup_Combine =
          res.baseData.makeupPrintingCombine;
        this.productFrom.baseData.makeup_Modules = res.baseData.makeupModules;
        this.productFrom.baseData.makeup_PzDz = res.baseData.makeupPzDz;
        this.productFrom.baseData.makeup_Colors = res.baseData.makeupColors;
        this.productFrom.baseData.eachGroupQuantity =
          res.baseData.eachGroupQuantity;
        this.productFrom.baseData.eachGroupHeight =
          res.baseData.eachGroupHeight;
        this.productFrom.baseData.metersPerRoll = res.baseData.metersPerRoll;
        if (this.$route.query.typeStatus== 0) {
          this.productFrom.baseData.knifeInformation =
            res.baseData.knifeInformation;
          this.productFrom.baseData.plateInformation =
            res.baseData.plateInformation;
        }
        this.productFrom.baseData.productionMode =
          res.baseData.productionMode == 0 ? "" : res.baseData.productionMode;
        this.productFrom.baseData.productionDimensions =
          res.baseData.productionDimensions;

        //彩稿信息
        if (
          res.productColorDraftFileList &&
          res.productColorDraftFileList.length
        ) {
          const ur = [];
          res.productColorDraftFileList.forEach((e) => {
            ur.push(e.draftFileUrl);
          });
          this.$nextTick(() => {
            this.urlList = ur;
            // this.showViewer = true
          });
        }
        //标签信息
        this.productFrom.orderTagDataList = res.productTagList;

        //物料信息
        if (Number(this.$route.query.typeStatus) === 0) {
          if (res.productMaterialList.length > 0) {
            res.productMaterialList.forEach((item) => {
              item.goodsCode = item.specification;
              item.goodsName = item.materialName;
              item.categoryName = item.materialType;
              item.stockQuantity = item.stockQuantity;
              item.stockGoodsName = item.stockGoodsName;
            });
          }
          // if(this.productFrom.produceMaterialList.length>0){
          //   this.productFrom.produceMaterialList.forEach((item)=>{
          //     res.productMaterialList.forEach((x)=>{
          //       if(item.stockGoodsCode == x.stockGoodsCode){
          //         x.craftTaskClientNo = item.craftTaskClientNo
          //       }
          //     })
          //   })
          // }
          this.productFrom.produceMaterialList = res.productMaterialList;
        }

        //颜色信息
        if (this.productFrom.colorMachineList.length > 0) {
          this.productFrom.colorMachineList.forEach((item) => {
            res.productPrintingColorList.forEach((x) => {
              if (item.printColorCode == x.colorCode) {
                x.machineCode = item.machineCode;
              }
            });
          });
        }
        this.productFrom.productPrintingColorList =
          res.productPrintingColorList;
      });
    },

    format(val) {
      let str = "";
      if (val == 1) {
        str = "自动贴";
      } else if (val == 2) {
        str = "手贴";
      }
      return str;
    },

    // 复制
    getCopyOrderDetail() {
      const parmas = {
        saleOrderNo: this.$route.query.saleOrderNo,
        produceBillType: this.$route.query.productType,
      };
      this.$api.product
        .AutoCreateProduceTaskBill(parmas)
        .then((copy) => {
          const parmast = {
            produceTaskBillNo: copy.produceTaskBillNo,
            produceTaskID: this.$route.query.produceTaskID,
          };
          this.$api.product
            .GetProduceTaskBillDetail(parmast)
            .then((info) => {
              this.productFrom = info;
              this.getProductDetail();
              info.baseData.produceTaskID = copy.baseData.produceTaskID;
              info.produceCraftList.forEach((n) => {
                n.produceCraft.craftTaskClientNo = n.produceCraft
                  .craftTaskClientNo
                  ? n.produceCraft.craftTaskClientNo
                  : uuid.v4();
              });
              info.produceMaterialList.forEach((e) => {
                info.produceCraftList.forEach((n) => {
                  if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
                    n.produceCraft.craftTaskClientNo = e.craftTaskClientNo;
                    this.selectArr.push({
                      name:
                        n.produceCraft.produceCraftName +
                        "/" +
                        this.getName(
                          n.craftEquipments,
                          n.produceCraft.produceEquipment
                        ),
                      craftTaskClientNo: e.craftTaskClientNo,
                    });
                  }
                });
              });
              this.productFrom = info;
              this.showColorDrafts();
              this.calculation();
              this.loading.close();
            })
            .catch(() => {
              this.loading.close();
            });
        })
        .catch(() => {
          this.loading.close();
        });
    },
    onCloseviewer() {
      this.isShadeShow = false;
    },
    showColorDrafts() {
      // const parmas = {
      //   orderNo: this.productFrom.orderBaseData.orderNo,
      // };
      // this.$api.product
      //   .QueryOrdersColorDrafts(parmas)
      //   .then((res) => {
      //     if (res.fileDataList && res.fileDataList.length) {
      //       const ur = [];
      //       res.fileDataList.forEach((e) => {
      //         ur.push(e.draftFilePreviewUrl);
      //       });
      //       this.$nextTick(() => {
      //         this.urlList = ur;
      //         // this.showViewer = true
      //       });
      //     } else {
      //       // this.$message({
      //       //   type: 'error',
      //       //   message: '暂无彩稿'
      //       // })
      //     }
      //   })
      //   .catch(() => {});
    },
    // 选择订单
    selectCurrentRow() {},
    // 确认订单
    confirmOrder() {
      const parmas = {
        produceTaskID: this.productFrom.baseData.produceTaskID,
      };
      this.$api.product
        .SureProduceTaskBill(parmas)
        .then((res) => {
          window.close()
        })
        .catch(() => {});
    },
    // 选择工艺
    refuseListsAll(val) {
      const parmas = {
        craftCodes: [],
      };
      val.forEach((i) => {
        parmas.craftCodes.push(i.code);
      });
      this.$api.product
        .SureChooseProduceCraftEquipmentMaps(parmas)
        .then((res) => {
          const _data = [];
          res.forEach((e) => {
            const _ar = {
              produceCraft: {},
              craftEquipments: [],
            };
            console.log(_ar, 888, e);
            _ar.produceCraft.produceCraftName = e.craftName;
            _ar.produceCraft.produceCraftNo = e.craftCode;
            _ar.produceCraft.craftTaskClientNo = uuid.v4();
            _ar.produceCraft.craftTaskPlanUseTime = 0;
            _ar.produceCraft.standardEfficiency = 0;
            _ar.produceCraft.craftTaskRemark = "";
            _ar.craftEquipments = e.craftEquipments;
            _ar.produceCraft.produceEquipment = e.craftEquipments[0]
              ? e.craftEquipments[0].equipmentCode
              : "";
            _ar.produceCraft.produceEquipmentName = e.craftEquipments[0]
              ? e.craftEquipments[0].equipmentName
              : "";
            console.log(_ar, 888);
            _data.push(_ar);
          });
          console.log(_data);
          _data.forEach((e) => {
            this.productFrom.produceCraftList.push(e);
          });
          this.handlePlanned();
        })
        .catch(() => {});
    },
    // 选择物料
    refuseListsMateriAll(val) {
      const _data = [];

      val.forEach((e) => {
        const _ar = {
          goodsName: "",
          goodsCode: "",
          stockGoodsCode: "",
          stockGoodsName: "",
          specificationName: "",
          categoryName: "",
          stockQuantity: 0,
          planMaterialQuantity: 0,
          printMaterialQuantity: 0,
          produceMaterialRemark: "",
        };
        _ar.stockGoodsCode = e.specificationCode;
        _ar.goodsCode = e.specificationCode;
        _ar.stockGoodsName = e.stockGoodsName;
        _ar.stockQuantity = e.stockSumQuantity;
        _ar.goodsName = e.goodsName;
        _ar.specificationName = e.specificationName;
        _ar.categoryName = e.categoryName;
        _data.push(_ar);
      });
      _data.forEach((e) => {
        this.productFrom.produceMaterialList.push(e);
      });
    },
    // 删除工艺
    craftDelete(cl, index) {
      this.$confirm("是否删除该工艺?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        const _status = this.productFrom.produceMaterialList.some(
          (item) => item.craftTaskClientNo === cl.produceCraft.craftTaskClientNo
        );
        if (_status) {
          this.$message({
            type: "error",
            message: "有引用的生产物料，请先删除!",
          });
          return;
        } else {
          this.productFrom.produceCraftList.splice(index, 1);
          this.$message({
            type: "success",
            message: "删除成功!",
          });
        }
      });
    },
    // 删除物料
    matairDelete(index) {
      this.$confirm("是否删除该物料?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.productFrom.produceMaterialList.splice(index, 1);
        this.$message({
          type: "success",
          message: "删除成功!",
        });
      });
    },
    // setSort() {
    //   const el = document.getElementById("dragList");
    //   Sortable.create(el, {
    //     ghostClass: "sortable-ghost", // 放置占位符的类名
    //     handle: ".my-handle",
    //     onUpdate: (evt) => {
    //       const targetRow = this.productFrom.produceCraftList.splice(
    //         evt.oldIndex,
    //         1
    //       )[0];
    //       this.productFrom.produceCraftList.splice(evt.newIndex, 0, targetRow);
    //       const newArray = this.productFrom.produceCraftList.slice(0);
    //       this.productFrom.produceCraftList = [];
    //       newArray.forEach((m, x) => {
    //         m.produceCraft.produceCraftSort = x + 1;
    //       });
    //       this.$nextTick(() => {
    //         this.productFrom.produceCraftList = newArray;
    //       });
    //     },
    //   });
    // },

    // 开单保存
    saveOrder(type) {
      const _data = {};
      const productTagCodes = [];
      const produceMaterials = [];
      const produceCrafts = [];
      const {
        outDirectionName,
        productStyleName,
        scrollDirectionName,
        tagAffixWayName,
        ..._producePackage
      } = this.productFrom.packageData;
      _producePackage.saleOrderNo = this.productFrom.orderBaseData.orderNo;
      this.productFrom.orderTagDataList.forEach((e) => {
        productTagCodes.push(e.productTagCode);
      });
      this.productFrom.produceMaterialList.forEach((e) => {
        const _mater = {
          stockGoodsCode: "",
          planUseQuantity: 0,
          materialRemark: "",
        };
        if (e.specification) {
          _mater.stockGoodsCode = e.specification;
        } else {
          _mater.stockGoodsCode = e.stockGoodsCode;
        }
        _mater.planUseQuantity = Number(e.planMaterialQuantity);
        _mater.printMaterialQuantity = Number(e.printMaterialQuantity);
        _mater.materialRemark = e.produceMaterialRemark;
        _mater.craftTaskClientNo = e.craftTaskClientNo || "";
        produceMaterials.push(_mater);
      });
      // this.productFrom.produceCraftList.forEach((e) => {
      //   // eslint-disable-next-line no-unused-vars
      //   const { produceCraftName, ...carft } = e.produceCraft;
      //   if (
      //     this.productFrom.baseData.planCpMeters === 0 ||
      //     carft.craftTaskPlanUseTime === 0
      //   ) {
      //     carft.standardEfficiency = 0;
      //   } else {
      //   }
      //   carft.standardEfficiency = (
      //     (this.productFrom.baseData.planCpMeters /
      //       carft.craftTaskPlanUseTime) *
      //     60
      //   ).toFixed(0);

      //   produceCrafts.push(carft);
      // });

      _data.makeup_RollSize = Number(this.productFrom.baseData.makeup_RollSize);
      _data.makeup_DigitalEdition = Number(
        this.productFrom.baseData.makeup_DigitalEdition
      );
      _data.makeup_SkipDistance = Number(
        this.productFrom.baseData.makeup_SkipDistance
      );
      _data.makeup_SpaceBetween = Number(
        this.productFrom.baseData.makeup_SpaceBetween
      );
      _data.makeup_Combine = this.productFrom.baseData.makeup_Combine;
      _data.makeup_Modules = this.productFrom.baseData.makeup_Modules;
      _data.makeup_PzDz = this.productFrom.baseData.makeup_PzDz;
      _data.makeup_Colors = this.productFrom.baseData.makeup_Colors;
      _data.produceRemark = this.productFrom.baseData.produceRemark;
      _data.planCpMeters = this.productFrom.baseData.planCpMeters;
      _data.productionQuantity = this.productFrom.baseData.productionQuantity;
      _data.eachGroupQuantity = this.productFrom.baseData.eachGroupQuantity;
      _data.eachGroupHeight = this.productFrom.baseData.eachGroupHeight;
      _data.theoreticalMaterials =
        this.productFrom.baseData.theoreticalMaterials;
      _data.printingMaterials = this.productFrom.baseData.printingMaterials;
      _data.materialArrival = this.productFrom.baseData.materialArrival;
      _data.metersPerRoll = this.productFrom.baseData.metersPerRoll;
      _data.knifeInformation = this.productFrom.baseData.knifeInformation;
      _data.plateInformation = this.productFrom.baseData.plateInformation;
      _data.marginSize = this.productFrom.baseData.marginSize;
      _data.plannedMaterials = this.productFrom.baseData.plannedMaterials;
      _data.produceTaskID = this.productFrom.baseData.produceTaskID;
      _data.producePackage = _producePackage;
      _data.productTagCodes = productTagCodes;
      _data.produceMaterials = produceMaterials;
      _data.produceCrafts = this.productFrom.produceCraftList.map((x) => {
        return x.produceCraft;
      });

      for (let index = 0; index < _data.produceCrafts.length; index++) {
        _data.produceCrafts[index].produceCraftSort = index + 1;
        if (_data.produceCrafts[index].produceEquipment === "") {
          this.$message({
            type: "error",
            message: "请选择生产工艺下的设备名称!",
          });
          return;
        }
      }
      for (let index = 0; index < _data.produceCrafts.length; index++) {
        if (_data.produceCrafts[index].craftTaskPlanUseTime === "") {
          this.$message({
            type: "error",
            message: "请输入计划工时!",
          });
          return;
        }
      }
      for (let index = 0; index < produceMaterials.length; index++) {
        if (produceMaterials[index].craftTaskClientNo === "") {
          this.$message({
            type: "error",
            message: "请选择生产物料下的生产工艺!",
          });
          return;
        }
      }
      for (let index = 0; index < produceMaterials.length; index++) {
        if (produceMaterials[index].planUseQuantity === "") {
          this.$message({
            type: "error",
            message: "请输入计划用料!",
          });
          return;
        }
      }
      if (
        this.productFrom.productPrintingColorList &&
        this.productFrom.productPrintingColorList.length > 0
      ) {
        _data.colorMachines = this.productFrom.productPrintingColorList.map(
          (item) => {
            return {
              produceTaskBillNo: this.productFrom.baseData.produceTaskBillNo,
              printColorCode: item.colorCode,
              machineCode: item.machineCode,
            };
          }
        );
      }
      this.$refs.orderForm.validate((valid) => {
        if (valid) {
          if(type == 'confirm'){
            if(this.produceTasksID){
              _data.produceTaskID = this.produceTasksID
            }
            this.$api.product
              .ExcuteUpdateProduceTaskBill(_data)
              .then((res) => {
                this.confirmOrder()
              })
              .catch(() => {});
          }else{
            if(this.produceTasksID){
              _data.produceTaskID = this.produceTasksID
            }
            this.$api.product
              .ExcuteUpdateProduceTaskBill(_data)
              .then((res) => {
                window.close()
              })
              .catch(() => {});
          }
        }
      });
    },
    // 控制标签内容层显示隐藏
    shrink(item) {
      this.$set(item, "isShow", !item.isShow);
    },
    // 计算产品包装，每箱共计多少枚
    getBoxEqualTags() {
      const pageEqualTagsNum = Number(
        this.productFrom.packageData.pageEqualTags
      );
      const packageEqualPagesNum = Number(
        this.productFrom.packageData.packageEqualPages
      );
      const boxEqualPackagesNum = Number(
        this.productFrom.packageData.boxEqualPackages
      );
      if (this.productFrom.packageData.productStyle !== 2) {
        this.productFrom.packageData.boxEqualTags =
          pageEqualTagsNum * packageEqualPagesNum * boxEqualPackagesNum;
      } else {
        this.productFrom.packageData.boxEqualTags =
          pageEqualTagsNum * boxEqualPackagesNum;
      }
    },
    // 初始化订单数据
    getInitOrder(oldOrderNo) {},
    // 返回
    Back() {
      if (Number(this.$route.query.typeStatus) === 0) {
        this.$confirm("生产单未保存,是否保存?", "提示", {
          confirmButtonText: "保存",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.saveOrder();
          })
          .catch(() => {
            window.close()
          });
      } else {
        window.close()
      }
    },
  },
};
</script>
<style lang="scss" scoped>
::v-deep .el-form-item__label::before {
  position: absolute;
  left: -10px;
  top: 0;
}

.tableDiv ul{
  display: flex !important;
}


.overflow{
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
</style>
<style lang="scss">
</style>
